import {ModalForm} from "@ant-design/pro-form";
import ProTable, {ProTableProps} from "@ant-design/pro-table";
import {ModalFormProps} from "@ant-design/pro-form/lib/layouts/ModalForm";
import {Button} from "antd";
import React, {useState} from "react";
import columns from "@/pages/system/tool/gen/list/components/DataBaseTable/config/columns";
import {getDatabaseTableList, importTable} from "@/services/gen/api";
import {ActionType} from "@ant-design/pro-table/lib/typing";

export default ({parentActionRef}: { parentActionRef: React.MutableRefObject<ActionType | undefined> }) => {
  const [selectedRowKeys, setSelectedRowKeys] = useState<any[]>([]);
  const modalFormProps: ModalFormProps = {
    trigger: (<Button type={"primary"}>导入</Button>),
    onFinish: async (values) => {
      return await importTable(selectedRowKeys).then(res => {
        setSelectedRowKeys([])
        parentActionRef.current?.reload()
        return true;
      })
    },
    title: "要导入的表",
    width: 1400
  }
  const proTableProps: ProTableProps<any, any> = {
    request: async (params, sort, filter) => {
      const data = {
        pageSize: params.pageSize,
        pageNum: params.current,
        tableName: params.TABLE_NAME
      }
      return await getDatabaseTableList(data).then(res => {
        return {
          data: res.data.records,
          total: res.data.total,
          success: true
        }
      })
    },
    // @ts-ignore
    columns,
    rowSelection: {
      selectedRowKeys,
      onChange: (newSelectedRowKeys) => {
        setSelectedRowKeys(newSelectedRowKeys);
      }
    },
    rowKey: 'TABLE_NAME',
    tableAlertRender: false
  }

  return (
    <ModalForm {...modalFormProps}>
      <ProTable {...proTableProps}/>
    </ModalForm>
  )
}
